<template>
	<view class="content">
			<!-- <image class="logo" src="/static/logo.png"></image> -->
			<!-- 头部 -->
				<view>
					<view>
						<view>{{ parttimeVo.parttimeTitle }}</view>
					</view>
					<view class="top">
						<!-- <text class="title">{{title}}</text> -->
						<view class="money">
							<view>{{parttimeVo.parttimeLable}}</view>
							<view class="tag">{{parttimeVo.parttimeLable}}</view>
						</view>
						<view class="salary">{{parttimeVo.parttimeMoney}}</view>
					</view>	
				</view>
				<!-- 职位位详情 -->
				<view class="bodybig">
					<view>
						<view>职位详情</view>
						<view class="body">
								<view>{{parttimeVo.parttimeLable}}</view>
								<view class="body-1">{{parttimeVo.parttimeLable}}</view>
						</view>
					</view>
					<view class="body-2">
						<view>{{parttimeVo.categoryContent}}</view>
					</view>	
				</view>
				<!-- 时间及地址 -->
				<view class="time">
					<view>工作时间：{{parttimeVo.parttimeStart}} --- {{parttimeVo.parttimeEnd}}</view>
					<view class="location">工作地点：{{parttimeVo.parttimeSeat}}</view>
					<view>商家名：{{parttimeVo.parttimeCompanyName}}</view>
				</view>
				<view class="foot">
					<view>订单号：************</view>
				</view>
				<view class="foot-monne">
					<view class="tu">20￥</view>
					<view>
						<button class="tu" type="primary" size="mini" @click="payment">支付</button>
					</view>
				</view>
		</view>
</template>

<script>
	export default {
		data() {
			return {
				parttimeVo: {
					parttimeTitle:"但嗲夺取鸡蛋清",
					parttimeMoney:"8K-13K",
					parttimeLable:"性别",
					categoryContent:"胆大基本都几把九点半",
					parttimeStart:"8:00",
					parttimeEnd:"18:00",
					parttimeSeat:"成都",
					parttimeCompanyName:"万息",
				},
				
			};
		},
		methods: {
			payment() {
				uni.navigateTo({
					url: "/pages/management/management"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	
		// *{
		// 	border: 1px red solid;
		// 	}

.content {;
		margin-left: 10rpx;
		margin-right: 10rpx;
	}
	
	// 头部scss
	.top {
		display: flex;
		margin-top: 20rpx;
		margin-bottom: 20rpx;
		justify-content: space-between; 
		border-bottom: 1rpx black solid;
		.money{
			font-size: 24rpx;
			display: flex;
			justify-content: space-around;
			.tag{
				margin-left: 20rpx;
			}
		}
		.salary{
			font-size: 50rpx;
		}
		
	}
	
	// 职位详情scss
	.bodybig{
		border-bottom: 1rpx black solid;
	}
	.body{
		display: flex;
		justify-content: flex-start;
		margin-left: 20rpx;
	}
	.body-1{
		margin-left: 20rpx;
	}
	
	.body-2{
		font-size: 24rpx;
		margin-top: 100rpx;
		margin-bottom: 100rpx;
	}
	// 时间及地址scss
	.time{
	    border-bottom: 1rpx black solid;
		margin-top: 10rpx;
		margin-bottom: 20rpx;
	}
	
	.location{
		margin-top: 50rpx;
		margin-bottom: 50rpx;
	}
	
	.foot{
		font-size: 24rpx;
		margin-top: 50rpx;
		margin-bottom: 50rpx;
	}
	.foot-monne{
		font-size: 24rpx;
		display: flex;
		justify-content: space-between;
		.tu{
			border: 1px black solid;
			padding-left: 60rpx;
			padding-right: 60rpx;
			padding-top: 20rpx;
			padding-bottom: 20rpx;
			display: flex;
	        align-items: center;
		}
	}
	

</style>
